<template>
  <!-- 具体form表单 -->
  <el-form label-suffix="：" label-position="right" ref="cgqForm" :rules="cgqForm" :model="currentRow"
           label-width="115px"
           class="work-point-form">
    <el-collapse v-model="activeName" v>
      <el-collapse-item title="监测点信息" name="监测点信息" style="text-align: center">
        <p class="equip_label">监测点名称:<span class="info">{{monitorPointInfo.name}}</span></p>
        <el-divider direction="vertical"></el-divider>
        <p class="equip_label">监测类型:<span class="info">{{monitorPointInfo.monitorTypeName}}</span></p>
        <el-divider direction="vertical"></el-divider>

      </el-collapse-item>
      <!-- 当监测类型为深部位移，岩性分布，则需要新增以下表单内容 -->
      <el-collapse-item title="设备信息" name="设备信息" class="sensor_table" v-if="currentRow.monitorType === 2">
        <el-form-item label="基准点" prop="bindEquipId">
          <el-select v-model.trim="currentRow.bindEquipId" filterable @change="bindEquipIdChange" placeholder="选择监测设备">
            <el-option v-for="item in monitorRelationTypeList"
                       :disabled="item | equipDisable(currentRow.monitorType,currentRow.bindEquipId)"
                       :key="item.id"
                       :value="item.id"
                       :label="item.caseCode?item.caseCode+'('+item.sn+')':item.sn">
              <span style="float: left;">{{ item.caseCode?item.caseCode:item.sn }}</span>
              <span style="float: right; color: #8492a6; font-size: 13px">{{ item.caseCode?item.sn:''}}{{'('+item.equipName+')'}}</span>
            </el-option>
          </el-select>
        </el-form-item>
        <!-- 其他监测类型 非拉线拉力和深部位移 -->
        <template v-if="currentRow.bindEquipId && ![1,7, 9,14].includes(currentRow.monitorType)">
          <el-form-item label="测点"
                        prop="monitorPointSensorList.0.sensorId"
                        :rules="cgqForm.sensorId">
            <el-select v-model="currentRow.monitorPointSensorList[0].sensorId" placeholder="选择传感器" filterable>
              <el-option v-for="item in cgqList" :disabled="!!item.monitorPointId" :key="item.id"
                         :label="item.code"
                         :value="item.id">
                {{item.code}}
              </el-option>
            </el-select>
          </el-form-item>
        </template>
        <!-- 当监测类型为深部位移且不是滑动式测斜仪时，则需要新增以下表单内容 -->
        <div v-if="currentRow.monitorType === 1 && notAHD1" class="sensor_table">
          <!--          <el-button type="primary" icon="el-icon-plus" @click="addCGQ1">添加</el-button>-->
          <el-table border :data="currentRow.monitorPointSensorList" class="m-t-24 form_table">
            <el-table-column label="深度(m)">
              <template slot-scope="scope">
                <el-form-item label-width="0px" :prop="`monitorPointSensorList.${scope.$index}.depth`"
                              :rules="cgqForm.depth">
                  <el-input v-model="scope.row.depth" placeholder="请输入" size="mini" :maxlength="3" type="number"
                            style="width:100%">
                    <template slot="append">m</template>
                  </el-input>
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column label="传感器">
              <template slot-scope="scope">
                <el-form-item label-width="0px" :prop="`monitorPointSensorList.${scope.$index}.sensorId`"
                              :rules="cgqForm.sensorId">
                  <el-select v-model.trim="scope.row.sensorId" size="mini" filterable
                             @change="_setHolePosition(scope.row, scope.row.sensorId)" placeholder="选择传感器">
                    <el-option v-for="item in cgqList" :key="item.id" :label="item.code" :value="item.id"></el-option>
                  </el-select>
                </el-form-item>
              </template>
            </el-table-column>

            <el-table-column label="操作" width="90">
              <template slot-scope="scope">
                <el-button type="text" @click="handleDelete(scope.$index)">删除</el-button>
              </template>
            </el-table-column>
          </el-table>
        </div>


        <!-- 当监测类型为静力水准，则需要新增以下表单内容 -->
        <div v-if="currentRow.monitorType === 7">
          <el-button type="primary" icon="el-icon-plus" @click="addCGQ7">添加</el-button>
          <el-form :model="currentRow" ref="cgqForm" class="sensor_table" :rules="jlszForm" size="small">
            <el-table border :data="currentRow.monitorPointSensorList" class="m-t-24 form_table">
              <el-table-column label="节点名称">
                <template slot-scope="scope">
                  <el-form-item label-width="0px" :prop="`monitorPointSensorList.${scope.$index}.sensorName`"
                                :rules="jlszForm.sensorname">
                    <el-input v-model="scope.row.sensorName" size="mini" placeholder="请输入" :maxlength="10"
                              style="width:100%"></el-input>
                  </el-form-item>
                </template>
              </el-table-column>
              <el-table-column label="节点编号">
                <template slot-scope="scope">
                  <el-form-item label-width="0px" :prop="`monitorPointSensorList.${scope.$index}.sensorIndex`">
                    <el-input v-model="scope.row.sensorIndex" :maxlength="10" disabled size="mini"
                              style="width:100%">
                      <template slot="append" v-if="scope.row.sensorIndex===0">(基准点)</template>
                    </el-input>
                  </el-form-item>
                </template>
              </el-table-column>

              <el-table-column label="传感器">
                <template slot-scope="scope">
                  <el-form-item label-width="0px" :prop="`monitorPointSensorList.${scope.$index}.sensorId`"
                                :rules="cgqForm.sensorId">
                    <el-select v-model.trim="scope.row.sensorId" clearable size="mini" filterable
                               @change="_setHolePosition(scope.row, scope.row.sensorId)" placeholder="选择传感器">
                      <el-option v-for="item in cgqList" :key="item.id" :label="item.code" :value="item.id"></el-option>
                    </el-select>
                  </el-form-item>
                </template>
              </el-table-column>

              <el-table-column label="操作" width="90">
                <template slot-scope="scope">
                  <el-button type="text" @click="handleDelete(scope.$index)">删除</el-button>
                </template>
              </el-table-column>
            </el-table>
          </el-form>
        </div>
        <!-- 当监测类型为拉线拉力时 -->
        <div v-if="currentRow.monitorType === 9">
          <el-form :model="currentRow" ref="cgqForm" class="sensor_table" :rules="cgqForm" size="small">
            <el-table border :data="currentRow.monitorPointSensorList" class="m-t-24 form_table">
              <el-table-column label="传感器类型">
                <template slot-scope="scope">
                  <el-form-item>
                    {{scope.row.sensorTypeName}}
                  </el-form-item>
                </template>
              </el-table-column>

              <el-table-column label="传感器">
                <template slot-scope="scope">
                  <el-form-item label-width="0px" :prop="`monitorPointSensorList.${scope.$index}.sensorId`"
                                :rules="cgqForm.sensorId">
                    <el-select v-model.trim="scope.row.sensorId" clearable placeholder="选择传感器" filterable>
                      <el-option v-for="item in cgqList1[scope.$index]" :key="item.id" :label="item.code"
                                 :value="item.id"></el-option>
                    </el-select>
                  </el-form-item>
                </template>
              </el-table-column>

            </el-table>
          </el-form>
        </div>
      </el-collapse-item>
      <el-collapse-item title="设备信息" name="设备信息" class="sensor_table" v-else >
        <el-form-item label="监测设备" prop="bindEqui pId">
          <el-select v-model.trim="currentRow.bindEquipId" filterable @change="bindEquipIdChange" placeholder="选择监测设备">
            <el-option v-for="item in monitorRelationTypeList"
                       :disabled="item | equipDisable(currentRow.monitorType,currentRow.bindEquipId)"
                       :key="item.id"
                       :value="item.id"
                       :label="item.caseCode?item.caseCode+'('+item.sn+')':item.sn">
              <span style="float: left;">{{ item.caseCode?item.caseCode:item.sn }}</span>
              <span style="float: right; color: #8492a6; font-size: 13px">{{ item.caseCode?item.sn:''}}{{'('+item.equipName+')'}}</span>
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="功能" prop="cameraControl" v-if="monitorPointInfo.monitorType==14">
          <el-checkbox-group v-model.trim="currentRow.cameraControl" @change="checkBoxBtn()">
            <el-checkbox  v-for="item in EnumCamerControlList"  :key="item.code" :label="item.code">{{item.name}}</el-checkbox>
          </el-checkbox-group>
        </el-form-item>
        <!-- 其他监测类型 非拉线拉力和深部位移 -->
        <template v-if="currentRow.bindEquipId && ![1,7, 9,14,16].includes(currentRow.monitorType)">
          <el-form-item label="传感器"
                        prop="monitorPointSensorList.0.sensorId"
                        :rules="cgqForm.sensorId">
            <el-select v-model="currentRow.monitorPointSensorList[0].sensorId" placeholder="选择传感器" filterable>
              <el-option v-for="item in cgqList" :disabled="!!item.monitorPointId" :key="item.id"
                         :label="item.code"
                         :value="item.id">
                {{item.code}}
              </el-option>
            </el-select>
          </el-form-item>
        </template>
        <!-- 当监测类型为深部位移且不是滑动式测斜仪时，则需要新增以下表单内容 -->
        <div v-if="currentRow.monitorType === 1 && notAHD1" class="sensor_table">
          <!--          <el-button type="primary" icon="el-icon-plus" @click="addCGQ1">添加</el-button>-->
          <el-table border :data="currentRow.monitorPointSensorList" class="m-t-24 form_table">
            <el-table-column label="深度(m)">
              <template slot-scope="scope">
                <el-form-item label-width="0px" :prop="`monitorPointSensorList.${scope.$index}.depth`"
                              :rules="cgqForm.depth">
                  <el-input v-model="scope.row.depth" placeholder="请输入" size="mini" :maxlength="3" type="number"
                            style="width:100%">
                    <template slot="append">m</template>
                  </el-input>
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column label="传感器">
              <template slot-scope="scope">
                <el-form-item label-width="0px" :prop="`monitorPointSensorList.${scope.$index}.sensorId`"
                              :rules="cgqForm.sensorId">
                  <el-select v-model.trim="scope.row.sensorId" size="mini" filterable
                             @change="_setHolePosition(scope.row, scope.row.sensorId)" placeholder="选择传感器">
                    <el-option v-for="item in cgqList" :key="item.id" :label="item.code" :value="item.id"></el-option>
                  </el-select>
                </el-form-item>
              </template>
            </el-table-column>

            <el-table-column label="操作" width="90">
              <template slot-scope="scope">
                <el-button type="text" @click="handleDelete(scope.$index)">删除</el-button>
              </template>
            </el-table-column>
          </el-table>
        </div>
        <!-- 当监测类型为静力水准，则需要新增以下表单内容 -->
        <div v-if="currentRow.monitorType === 7">
          <el-button type="primary" icon="el-icon-plus" @click="addCGQ7">添加</el-button>
          <el-form :model="currentRow" ref="cgqForm" class="sensor_table" :rules="jlszForm" size="small">
            <el-table border :data="currentRow.monitorPointSensorList" class="m-t-24 form_table">
              <el-table-column label="节点名称">
                <template slot-scope="scope">
                  <el-form-item label-width="0px" :prop="`monitorPointSensorList.${scope.$index}.sensorName`"
                                :rules="jlszForm.sensorname">
                    <el-input v-model="scope.row.sensorName" size="mini" placeholder="请输入" :maxlength="10"
                              style="width:100%"></el-input>
                  </el-form-item>
                </template>
              </el-table-column>
              <el-table-column label="节点编号">
                <template slot-scope="scope">
                  <el-form-item label-width="0px" :prop="`monitorPointSensorList.${scope.$index}.sensorIndex`">
                    <el-input v-model="scope.row.sensorIndex" :maxlength="10" disabled size="mini"
                              style="width:100%">
                      <template slot="append" v-if="scope.row.sensorIndex===0">(基准点)</template>
                    </el-input>
                  </el-form-item>
                </template>
              </el-table-column>

              <el-table-column label="传感器">
                <template slot-scope="scope">
                  <el-form-item label-width="0px" :prop="`monitorPointSensorList.${scope.$index}.sensorId`"
                                :rules="cgqForm.sensorId">
                    <el-select v-model.trim="scope.row.sensorId" clearable size="mini" filterable
                               @change="_setHolePosition(scope.row, scope.row.sensorId)" placeholder="选择传感器">
                      <el-option v-for="item in cgqList" :key="item.id" :label="item.code" :value="item.id"></el-option>
                    </el-select>
                  </el-form-item>
                </template>
              </el-table-column>

              <el-table-column label="操作" width="90">
                <template slot-scope="scope">
                  <el-button type="text" @click="handleDelete(scope.$index)">删除</el-button>
                </template>
              </el-table-column>
            </el-table>
          </el-form>
        </div>
        <!-- 当监测类型为拉线拉力时 -->
        <div v-if="currentRow.monitorType === 9">
          <el-form :model="currentRow" ref="cgqForm" class="sensor_table" :rules="cgqForm" size="small">
            <el-table border :data="currentRow.monitorPointSensorList" class="m-t-24 form_table">
              <el-table-column label="传感器类型">
                <template slot-scope="scope">
                  <el-form-item>
                    {{scope.row.sensorTypeName}}
                  </el-form-item>
                </template>
              </el-table-column>

              <el-table-column label="传感器">
                <template slot-scope="scope">
                  <el-form-item label-width="0px" :prop="`monitorPointSensorList.${scope.$index}.sensorId`"
                                :rules="cgqForm.sensorId">
                    <el-select v-model.trim="scope.row.sensorId" clearable placeholder="选择传感器" filterable>
                      <el-option v-for="item in cgqList1[scope.$index]" :key="item.id" :label="item.code"
                                 :value="item.id"></el-option>
                    </el-select>
                  </el-form-item>
                </template>
              </el-table-column>

            </el-table>
          </el-form>
        </div>
        <!-- 当监测类型为机器视觉，则需要新增以下表单内容 -->
        <div v-if="currentRow.monitorType === 16" class="sensor_table">
          <el-table border :data="currentRow.monitorPointSensorList" class="m-t-24 form_table">

            <el-table-column prop="sensorIndex" sortable label="序号" min-width="55"></el-table-column>
            <el-table-column label="测点名称">
              <template slot-scope="scope">
                <el-form-item label-width="0px" prop="sensorName"
                             >
                  <el-input v-model="scope.row.sensorName" placeholder="请输入" size="mini"
                            style="width:100%">
                  </el-input>
                </el-form-item>
              </template>
            </el-table-column>


          </el-table>
        </div>
      </el-collapse-item>
    </el-collapse>

  </el-form>
</template>

<script>
  import DoubleThree from '@/directives/double-three'
  import Enums from '@/utils/enums'

  import {
    queryEquipByMonitorType,
    monitorPointBindEquip
  } from '@/services/model/project-info'

  export default {
    mixins:[Enums],
    directives: {DoubleThree},
    data() {
      return {
        EnumCamerControlList:[],
        activeName: ['监测点信息', '设备信息'],
        index: 0,
        show: false,//岩性分布暂时弃用
        // form表单校验规则
        cgqForm: {
          depth: {required: true, message: '请输入深度'},
          bindEquipId: {required: true, message: '请选择监测设备'},
          sensorId: {required: true, message: '请选择传感器'},
        },
        jlszForm: {
          sensorname: {required: true, message: '请输入节点名称'},
          sensorId: {required: true, message: '请选择传感器'},
        },
        monitorPointInfo: {},
        currentRow: {
          cameraControl:[],
          startEndPileInfo: {},
          monitorPointSensorList: [{}],
        }, // 新增数据
        // 监测类型
        // 监测类型绑定传感器表
        monitorRelationTypeList: [],
        // 拉线拉力孔位选择
        code9holePositionList: [1, 2, 3, 4, 5, 6],
        // 其他孔位下拉列表
        codeOtherPositionList: [],
      }
    },
    filters: {
      equipDisable(equip, monitorType) {
        if (monitorType === 3) {
          // if (equip.sensorList[0].monitorPointId) {
          //   return true
          // }
        } else if (monitorType === 8) {
          if (equip.sensorList.length > 1) {
            return false;
          }
          if (equip.sensorList[0].monitorPointId) {
            return true
          }
        } else if (monitorType === 14) {
          if (equip.bindTime) {
            return true
          }
        }
        return false
      },
    },
    computed: {
      // sensorRelation() {
      //   return this.currentRow.monitorType === 1 || this.currentRow.monitorType === 7 || this.currentRow.monitorType === 9
      // },
      notAHD1() {
        let item = this.monitorRelationTypeList.find(x => x.id === this.currentRow.bindEquipId) || {}
        return item.model !== 1
      },

      // 传感器列表
      cgqList() {
        let sensorList = this.monitorRelationTypeList.find(x => x.id === this.currentRow.bindEquipId)?.sensorList || []
        return sensorList
      },
      cgqList1() {
        let sensorList = this.monitorRelationTypeList.find(x => x.id === this.currentRow.bindEquipId)?.sensorList || []
        let cgqList1 = []
        let sensorList2 = []
        let j = 0
        for (let i = 0; i < sensorList.length; i++) {
          if (sensorList[i].type === 7) {
            sensorList2[j] = sensorList[i]
            j++
          }
        }
        cgqList1[0] = sensorList2
        sensorList2 = []
        j = 0
        for (let i = 0; i < sensorList.length; i++) {
          if (sensorList[i].type === 6) {
            sensorList2[j] = sensorList[i]
            j++
          }
        }
        cgqList1[1] = sensorList2
        return cgqList1
      },
      // 时间选择器
      timerArray: {
        get() {
          return [this.currentRow.startTime, this.currentRow.endTime]
        },
        set([startTime, endTime]) {
          this.currentRow = {...this.currentRow, startTime, endTime}
        }
      },
    },
    methods: {
      // 获取当前的序号
      getIndex(index) {
        let param = (this.form.page - 1) * this.form.pageSize + index + 1
        return param
      },
      checkBoxBtn(){
        if(this.currentRow.cameraControl.indexOf(0)>-1){

        }
        this.$forceUpdate()
      },
      // 同步设置孔位/节点编号
      _setHolePosition(row, id) {
        const item = this.cgqList.find(x => x.id === id)
        row.holeLocation = item.holePosition
      },
      addCGQ1() {
        if (!this.currentRow.bindEquipId) return this.$message.warning('请选择监测设备后再添加')
        if (!this.cgqList.length) return this.$message.warning('无传感器可添加，请重新选择监测设备')
        this.currentRow.monitorPointSensorList.push({})
      },
      addCGQ7() {
        if (!this.currentRow.bindEquipId) return this.$message.warning('请选择监测设备后再添加')
        if (!this.cgqList.length) return this.$message.warning('无传感器可添加，请重新选择监测设备')
        this.currentRow.monitorPointSensorList.push({
          sensorIndex: this.currentRow.monitorPointSensorList.length
        })
      },
      // 监测设备改变
      bindEquipIdChange() {
        this.currentRow.monitorPointSensorList = [{}]
        // 监测类型非 1 深部位移、9 拉线拉力时展示
        if (this.currentRow.monitorType === 9) {
          this.currentRow.monitorPointSensorList = [
            {sensorType: 7, sensorTypeName: '拉力计'},
            {sensorType: 6, sensorTypeName: '位移计'}
          ]
        } else if (this.currentRow.monitorType === 1) {
          let sensorList = []
          this.cgqList.map(x => {
            sensorList.push({
              depth: '',
              sensorId: x.id,
            })
          })
          this.currentRow.monitorPointSensorList = sensorList
        } else if (this.currentRow.monitorType === 16) {
          let sensorList = []
          this.cgqList.map((x,index) => {
            sensorList.push({
              depth: '',
              sensorId: x.id,
              sensorName:'',
              sensorIndex:index+1
            })
          })
          this.currentRow.monitorPointSensorList = sensorList
        }else if ((this.currentRow.monitorType === 1 && this.notAHD1) || this.currentRow.monitorType === 7 || this.currentRow.monitorType === 14) {
          this.currentRow.monitorPointSensorList = []
        } else {
          // 初始化 孔位和传感器
          this.currentRow.monitorPointSensorList = [{}]
          this.setHolePositionLabel()
        }
      },
      // 监测类型选择
      async monitorTypeChange(value) {
        // 初始化数据
        this.currentRow.monitorPointSensorList = [{}]
        await this.queryMonitorRelationType(value)
        // this.$set(this.currentRow, 'bindEquipId', list[0]?.id)
        // 拉线拉力时固定该数据
        if (value === 9) {
          this.currentRow.monitorPointSensorList = [
            {sensorType: 7, sensorTypeName: '拉力计'},
            {sensorType: 6, sensorTypeName: '位移计'}
          ]
        } else if ((value === 1 && this.notAHD1) || value === 7 || value === 14) {
          this.currentRow.monitorPointSensorList = []
        } else {
          // 初始化 孔位和传感器
          this.currentRow.monitorPointSensorList = [{}]
          this.setHolePositionLabel()
        }
      },
      // 监测类型非 1 深部位移、9 拉线拉力时展示
      async setHolePositionLabel() {
        let list = []
        for (let i = 1; i <= 6; i++) {
          let item = {
            code: i,
          }
          list.push(item)
        }
        // 过滤出需要禁用的列表 monitorPointId有值代表已被绑定
        let forbidList = this.cgqList.filter(x => x.monitorPointId)
        forbidList.map(x => {
          let params = list.find(k => k.code === x.holePosition)
          if (params) params.disabled = true
        })
        this.codeOtherPositionList = list
      },
      //解绑设备
      async unboundEquip() {
        this.currentRow.bindEquipId = ''
        this.currentRow.monitorPointSensorList = []
        this.submitData()
      },
      // 删除
      handleDelete(index, model) {
        this.currentRow.monitorPointSensorList.splice(index, 1)
      },
      // 表单提交
      // parentResolve 从父级传入的rosolve
      validateForm() {
        this.$refs.cgqForm.validate((valid) => {
          if (valid) {
            this.submitData()
          }
        })
      },
      // 新增编辑提交数据
      async submitData() {
        // 根据ID判断使用新增还是编辑
        let res = await monitorPointBindEquip(this.currentRow)
        if (res.code === 200) {
          this.$notify({
            type: 'success',
            title: '提示',
            message: this.currentRow.bindEquipId ? '绑定成功' : '解绑成功'
          })
          this.$emit('update')
        }
      },
      // 新增数据
      handleAdd(monitorPointInfo) {
        this.monitorPointInfo = monitorPointInfo
        this.currentRow = {
          id: monitorPointInfo.id,
          monitorType: monitorPointInfo.monitorType,
          monitorPointSensorList: [{}],
        }
        this.currentRow.cameraControl=[]
        this.$nextTick(() => {
          this.$refs.cgqForm.clearValidate()
        })
        this.monitorTypeChange(this.currentRow.monitorType)
      },
      /**
       * row  当前操作行的对象
       */
      async handleEdit(monitorPointInfo) {
        this.monitorPointInfo = monitorPointInfo
        this.currentRow = JSON.parse(JSON.stringify(monitorPointInfo))
        this.currentRow.cameraControl=this.currentRow.cameraControl?this.currentRow.cameraControl:[]
        this.$nextTick(() => {
          this.$refs.cgqForm.clearValidate()
        })
        await this.queryMonitorRelationType(this.currentRow.monitorType)
        ![1, 9, 7].includes(this.currentRow.monitorType) && this.setHolePositionLabel()
      },
      // 监测类型绑定传感器表
      async queryMonitorRelationType(monitorType) {
        let {data} = await queryEquipByMonitorType({monitorType})
        this.monitorRelationTypeList = data
        return this.monitorRelationTypeList
      },
    },
    mounted() {
      this.queryDictList(['EnumProjectMonitorType','EnumCameraControl'], ['EnumProjectMonitorTypeList', 'EnumCamerControlList'])
    },
  }
</script>

<style lang="less" scoped>

  /deep/ .el-collapse-item__header {
    background-color: #1b1b1b;
    margin-top: 20px;
    color: white;
    font-size: 20px;
    height: 40px;
    border-radius: 10px;

  }

  .work-point-form {
    /deep/ .collapse {
      border: 1px solid #1990FE;
      border-top: none;

      .title, .text {
      }

      .el-radio__input, .el-radio__label {
      }

      .el-radio__input.is-checked .el-radio__inner {
        background: #1990FE !important;
      }
    }

    .el-form-item {
      display: inline-block;
      width: 50%;
    }
  }

  .sensor_table {
    /deep/ .el-table td, .el-table th {
      padding: 10px 0;
      font-size: 13px;
    }

    .el-form-item {
      width: 100%;

      .el-date-editor.el-input, .el-date-editor.el-input__inner {
        width: auto;
      }

      /deep/ .el-form-item__content {
        line-height: normal;
      }
    }
  }

  /deep/ .m-colorPicker {
    .box {
      position: fixed;
      bottom: 200px;

    }
  }

  .form_table {
    max-height: 52vh;
    overflow: auto;

    .el-form-item {
      margin-bottom: 0;
    }
  }

  /deep/ .el-form-item__label {
    color: #1990FE !important;
  }

  /deep/ .collapse .title .text {
    color: white !important;
  }

  .el-button--text {
    color: red !important;
  }

  .equip_label {
    display: inline-block;
    color: #1990FE;
    font-size: 18px;
    padding: 2px 0 3px 10px;

    .info {
      color: #000000;
      margin-left: 5px;
    }
  }


</style>
